By King

更新日期:

文章目录
  • 系统环境 ： windows 64x
  • ruby版本 ： 2.0.0p481
  • compass版本 ： 0.12.6
  • sass版本 : 3.3.7

#安装相关套件
compass 是ruby家族的一个前端开发插件，所以在使用compass之前务必安装ruby套件.

##1.检查自己的电脑是否安装了ruby套件

  • DOS下输入 ruby -v查看ruby版本信息
    如果不显示版本好则表明你没有安装ruby，这里需要保证你的ruby版本不低于1.8.7，如果低了就需要重新安装
  • DOS下输入 compass version 查看compass版本信息
  • DOS下输入 sass --v查看sass版本信息

ruby下载

##2. 安装Sass和Compass插件
Ruby自带了一个包管理其gem，我们直接使用gem去安装Ruby的相关包(插件)就可以了。

  • $ gem install sass 安装Sass
  • $ gem install compass 安装Compass

#创建项目
在你希望创建项目的目录下，DOS输入 $compass create <projectName> 这样一个基本的sass项目目录就创建出来了

  • 创建项目中的其他配置参数

    –bare {不包含默认样式表进行安装}
    –syntax sass {在默认样式表中使用缩进语法}
    –sass-dir ‘sass’ {使用sass目录存放Sass文件}
    –css-dir ‘css’ {使用css目录存放CSS文件}
    –images-dir ‘img’ {使用img目录存放image文件}
    –fonts-dir ‘font’ {使用font目录存放字体文件}
    –Javascripts-dir ‘js’ {使用 js目录存放Javascript脚本文件}

  • 举个栗子：

    1
    $ compass create sassProject --bare --sass-dir "sass" --css-dir "css" javascripts-dir "js"

#compass指令
sass是一门CSS预处理的语言，所以在使用前我们还需要将sass编译成相关的CSS文件或cass文件

compass create — 创建一个新的compass项目
compass init — 为一个已经存在的项目(Rails)添加compass
compass clean — 移除生成的文件和缓存
compass compile — 编译生成样式表和文件
compass watch — 监视Sass的文件改变，如果有变化则只需complie
compass stats — 查看样式表的统计数据
compass unpack — 解压扩展到自己的项目中
compass validate — 验证生成的CSS文件
compass version — 显示compass的版本，许可等版本信息
compass interactive — 进入一个用于测试Compass中SassScript控制台

文章目录